<template>
  <div class="full-height page-content content bg-white">
    <yz-condition-filter
      v-model="queryParams"
      @resetSearch="resetSearch"
      @onSubmit="getList(true)"
      class="padding-t-20"
    >
      <yz-input
        inputType="input"
        placeholder="请输入借出单号"
        title="申请单号"
        class="input-width margin-r-20"
        v-model="queryParams.number"
      />
      <yz-input
        inputType="input"
        placeholder="请输入领用人员"
        title="领用人员"
        class="input-width margin-r-20"
        v-model="queryParams.userId"
      />
      <select-tooltip
        v-model="queryParams.status"
        isShowAll
        class="input-width margin-r-20"
        :multiple="false"
        :options="$getEnum(Enums.INVENTORY_ALLOCATE_STATUS)"
        msg="申请状态"
      />
      <select-tooltip
        v-model="queryParams.category"
        isShowAll
        :multiple="false"
        :options="$getEnum(Enums.APPLY_OPTIONS)"
        msg="领用类型"
      />
      <yz-input
        inputType="input"
        title="关联维保单"
        class="input-width margin-r-20"
        v-model="queryParams.orderNumber"
      />
    </yz-condition-filter>
    <div class="form-inline bottom items-center">
      <q-btn
        class="btn margin-r-20"
        outline
        color="primary"
        label="新增"
        @click="onEdit('add')"
      />
    </div>
    <q-table
      :data="tableData"
      :columns="tableColumns"
      row-key="id"
      class="myTable scroll stick-last-col"
      :loading="isTableLoading"
      :pagination.sync="pagination"
      :hide-bottom="tableData.length > 0"
      no-data-label="暂无数据"
      color="primary"
    >
      <template v-slot:body-cell-status="props">
        <q-td>
          <set-color
            :options="$getEnum(Enums.INVENTORY_ALLOCATE_STATUS)"
            :colorType="props.row.status"
          />
        </q-td>
      </template>
      <template v-slot:body-cell-orderNumber="props">
        <q-td>
          <q-btn
            flat
            color="primary"
            :label="props.row.orderNumber"
            @click="toOrderNumber(props.row)"
          />
        </q-td>
      </template>
      <template v-slot:body-cell-createTime="props">
        <q-td>
          {{ props.row.createTime | toTime }}
        </q-td>
      </template>
      <template v-slot:body-cell-operations="props">
        <q-td class="operate" style="width: 125px">
          <div class="btn-group text-center">
            <table-btn btnType="detail" @click="onDetail(props.row)" />
            <table-btn
              btnType="edit"
              @click="onEdit('edit', props.row)"
              :disable="
                props.row.status !==
                  Enums.INVENTORY_ALLOCATE_STATUS.WAITING.value
              "
            />
            <table-btn
              btnType="delete"
              @click="onDelete(props.row.id)"
              :tips="`是否确认删除此领用申请?`"
              :disable="
                props.row.status !==
                  Enums.INVENTORY_ALLOCATE_STATUS.WAITING.value
              "
            />
          </div>
        </q-td>
      </template>
    </q-table>

    <yz-pagination v-model="pagination" @onSearch="getList" />
    <add-edit-dialog
      ref="addEditDialog"
      @getList="getList"
      :goodsCategoryCode="goodsCategoryCode"
    />
    <detail-dialog ref="detailDialog" />
  </div>
</template>

<script>
import addEditDialog from './add-edit-dialog'
import detailDialog from './apply-use-detail'
import PAGEMIXIN from 'src/components/basic-mixins/page-mixin'
import { getApplyList, deleteApply } from '../../../boot/spare/parts'
export default {
  name: 'apply-use',
  mixins: [PAGEMIXIN],
  components: {
    addEditDialog,
    detailDialog
  },
  props: {
    goodsCategoryCode: Number
  },
  data () {
    return {
      // tips: [
      //   '领用方式：',
      //   '电子单领用：根据刀具管理中电子刀单设置的对应模板，自动弹出对应的刀具型号。',
      //   '直接领用：根据已入库的刀具型号，直接选择。'
      // ],
      mixinViewModuleOptions: {
        getDataListURL: getApplyList, // 数据列表接口，API地址
        deleteURL: deleteApply, // 删除接口，API地址
        deleteIsBatchURL: '', // 删除接口，是否需要批量？
        deleteIsBatchKey: 'id', // 删除接口，批量状态下由那个key进行标记操作？比如：pid，uid...
        isSetData: false, // 获取的数据是否进去处理 func => setData
        isChangeData: false // 请求数据是否进去处理 func => changeData
      },
      newColumns: {
        number: '申请单号',
        category: '领用种类',
        sparePartCount: '领用数量',
        status: '申请状态',
        date: '期望日期',
        orderNumber: '关联维保单',
        departmentName: '领用部门',
        userName: '领用人员',
        createTime: '创建时间',
        operations: '操作'
      },
      dialogVisible: false,
      queryParams: {
        number: '',
        userId: '',
        orderNumber: '',
        category: 'all',
        status: 'all'
      }
    }
  },
  created () {
    this.getList()
  },
  methods: {
    toOrderNumber (row) {
      row.category === '维修领用'
        ? this.$router.push({
          name: 'repairList',
          params: {
            repairOrder: row.orderNumber
          }
        })
        : this.$router.push({
          name: 'maintenanceOrder',
          params: {
            orderNo: row.orderNumber
          }
        })
    },
    // 添加/编辑
    onEdit (type, data) {
      this.$refs.addEditDialog.showDialog(type, data)
    },
    onDetail (data) {
      this.$refs.detailDialog.showDialog(data)
    }
  }
}
</script>

<style scoped></style>
